<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="theme-color" content="#33474d">
	<title>正则表达式-语法 | 失落的乐章</title>
	<link rel="stylesheet" href="/css/style.css" />
	
      <link rel="alternate" href="/atom.xml" title="失落的乐章" type="application/atom+xml">
    
</head>

<body>

	<header class="header">
		<nav class="header__nav">
			
				<a href="/archives" class="header__link">Archive</a>
			
				<a href="/tags" class="header__link">Tags</a>
			
				<a href="/atom.xml" class="header__link">RSS</a>
			
		</nav>
		<h1 class="header__title"><a href="/">失落的乐章</a></h1>
		<h2 class="header__subtitle">技术面前，永远都是学生。</h2>
	</header>

	<main>
		<article>
	
		<h1>正则表达式-语法</h1>
	
	<div class="article__infos">
		<span class="article__date">2017-10-12</span><br />
		
		
			<span class="article__tags">
			  	<a class="article__tag-link" href="/tags/正则表达式/">正则表达式</a>
			</span>
		
	</div>

	

	
		<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;正则表达式（regular expression）描述了一种字符串匹配的模式（pattern），可以 用来检查一个串是否含有某种子串。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;将匹配的子串替换或者从某个串中取出符合某个条件的子串等。</p>
<ul>
<li><code>runoo+b</code> ，可以匹配 runoob、runooob、runoooooob等，+ 号代表前面的字符必须至少出现一次（1次或多次）。</li>
<li><code>runoo*b</code> ，可以匹配runob、runoob、runoooooob等，* 号代表字符可以不出现，也可以出现一次或多次（0次、1次、或多次）。</li>
<li><code>colou?r</code> ，可以匹配color或者colour，？问号代表前面的字符最多只可以出现一次（0次、1次）。</li>
</ul>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;构造正则表达式的方法和创建数学表达式的方法一样。也就是用多种元字符与运算符可以将小的表达式结合在一起来创建更大个表达式。正则表达式的组件可以是单个的字符、字符集合、字符范围、字符间的选择或者所有这些组件的任意组合。  </p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;正则表达式是由普通字符（如字符a到z）以及特殊字符（称为“元字符”）组成的文字模式。模式描述在搜索文本时要匹配的一个或多个字符串。正则表达式作为一个模版，将某个字符模式与所搜索的字符串进行匹配</p>
<h2 id="普通字符"><a href="#普通字符" class="headerlink" title="普通字符"></a>普通字符</h2><p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;普通字符包括没有显示指定为元字符的所有可打印和不可打印的字符。这包括所有大写和小写字母、所有数字、所有标点符号和一些其他符号。</p>
<h2 id="非打印字符"><a href="#非打印字符" class="headerlink" title="非打印字符"></a>非打印字符</h2><p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;非打印字符也可以是正则表达式的组成部分。下标列出了表示非打印字符的转义序列：</p>
<table>
<thead>
<tr>
<th>字符</th>
<th>描述</th>
</tr>
</thead>
<tbody>
<tr>
<td>\cx</td>
<td>匹配由x指明的控制字符。例如， \cM</td>
<td>匹配一个 Control-M 或回车符。x 的值必须为 A-Z 或 a-z 之一。否则，将 c 视为一个原义的 ‘c’ 字符。</td>
</tr>
<tr>
<td>\f</td>
<td>匹配一个换页符。等价于 \x0c 和 \cL。</td>
</tr>
<tr>
<td>\n</td>
<td>匹配一个换行符。等价于 \x0a 和 \cJ。</td>
</tr>
<tr>
<td>\r</td>
<td>匹配一个回车符。等价于 \x0d 和 \cM。</td>
</tr>
<tr>
<td>\s</td>
<td>匹配任何空白字符，包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]。</td>
</tr>
<tr>
<td>\S</td>
<td>匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。</td>
</tr>
<tr>
<td>\t</td>
<td>匹配一个制表符。等价于 \x09 和 \cI。</td>
</tr>
<tr>
<td>\v</td>
<td>匹配一个垂直制表符。等价于 \x0b 和 \cK。</td>
</tr>
</tbody>
</table>
<h2 id="特殊字符"><a href="#特殊字符" class="headerlink" title="特殊字符"></a>特殊字符</h2><p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;所谓特殊字符，就是一些有特殊含义的字符，如上面说的 <code>runoo*b</code> 中的 <code>*</code>，简单的说就是表示任何字符串的意思。如果要查找字符串中的 <code>*</code> 符号，则需要对 <code>*</code> 进行转义，即在其前加一个 <code>\</code>: <code>runo\*ob</code> 匹配 runo*ob。 </p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;许多元字符要求在试图匹配它们时特别对待。若要匹配这些特殊字符，必须首先使字符”转义”，即，将反斜杠字符\ 放在它们前面。下表列出了正则表达式中的特殊字符：</p>
<table>
<thead>
<tr>
<th>特别字符</th>
<th>描述</th>
</tr>
</thead>
<tbody>
<tr>
<td>$</td>
<td>匹配输入字符串的结尾位置。如果设置了 RegExp 对象的 Multiline 属性，则 $ 也匹配 ‘\n’ 或 ‘\r’。要匹配 $ 字符本身，请使用 \$。</td>
</tr>
<tr>
<td>( )</td>
<td>标记一个子表达式的开始和结束位置。子表达式可以获取供以后使用。要匹配这些字符，请使用 \( 和 \)。</td>
</tr>
<tr>
<td>*</td>
<td>匹配前面的子表达式零次或多次。要匹配 <em> 字符，请使用 \</em>。</td>
</tr>
<tr>
<td>+</td>
<td>匹配前面的子表达式一次或多次。要匹配 + 字符，请使用 \+。</td>
</tr>
<tr>
<td>.</td>
<td>匹配除换行符 \n 之外的任何单字符。要匹配 . ，请使用 \. 。</td>
</tr>
<tr>
<td>[</td>
<td>标记一个中括号表达式的开始。要匹配 [，请使用 \[。</td>
</tr>
<tr>
<td>?</td>
<td>匹配前面的子表达式零次或一次，或指明一个非贪婪限定符。要匹配 ? 字符，请使用 \?。</td>
</tr>
<tr>
<td>\</td>
<td>将下一个字符标记为或特殊字符、或原义字符、或向后引用、或八进制转义符。例如， ‘n’ 匹配字符 ‘n’。’\n’ 匹配换行符。序列 ‘\\’ 匹配 “\“，而 ‘\(‘ 则匹配 “(“。</td>
</tr>
<tr>
<td>^</td>
<td>匹配输入字符串的开始位置，除非在方括号表达式中使用，此时它表示不接受该字符集合。要匹配 ^ 字符本身，请使用 \^。</td>
</tr>
<tr>
<td>{</td>
<td>标记限定符表达式的开始。要匹配 {，请使用 \{。</td>
</tr>
<tr>
<td>\</td>
<td></td>
<td>指明两项之间的一个选择。要匹配 \</td>
<td>，请使用 \\</td>
<td>。</td>
</tr>
</tbody>
</table>
<h2 id="限定符"><a href="#限定符" class="headerlink" title="限定符"></a>限定符</h2><p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;限定符用来指定正则表达式的一个给定组件必须要出现多少次才能满足匹配。有<code>*</code>或<code>+</code>或<code>?</code>或<code>{n}</code>或<code>{n,}</code>或<code>{n,m}</code>共6种。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;正则表达式的限定符有：</p>
<table>
<thead>
<tr>
<th>字符</th>
<th>描述</th>
</tr>
</thead>
<tbody>
<tr>
<td>*</td>
<td>匹配前面的子表达式零次或多次。例如，zo<em> 能匹配 “z” 以及 “zoo”。</em> 等价于{0,}。</td>
</tr>
<tr>
<td>+</td>
<td>匹配前面的子表达式一次或多次。例如，’zo+’ 能匹配 “zo” 以及 “zoo”，但不能匹配 “z”。+ 等价于 {1,}。</td>
</tr>
<tr>
<td>?</td>
<td>匹配前面的子表达式零次或一次。例如，”do(es)?” 可以匹配 “do” 或 “does” 中的”do” 。? 等价于 {0,1}。</td>
</tr>
<tr>
<td>{n}</td>
<td>n 是一个非负整数。匹配确定的 n 次。例如，’o{2}’ 不能匹配 “Bob” 中的 ‘o’，但是能匹配 “food” 中的两个 o。</td>
</tr>
<tr>
<td>{n,}</td>
<td>n 是一个非负整数。至少匹配n 次。例如，’o{2,}’ 不能匹配 “Bob” 中的 ‘o’，但能匹配 “foooood” 中的所有 o。’o{1,}’ 等价于 ‘o+’。’o{0,}’ 则等价于 ‘o*’。</td>
</tr>
<tr>
<td>{n,m}</td>
<td>m 和 n 均为非负整数，其中n &lt;= m。最少匹配 n 次且最多匹配 m 次。例如，”o{1,3}” 将匹配 “fooooood” 中的前三个 o。’o{0,1}’ 等价于 ‘o?’。请注意在逗号和两个数之间不能有空格。</td>
</tr>
</tbody>
</table>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;由于章节编号在大的输入文档中会很可能超过九，所以需要一种方式来处理两位或三位章节编号。限定符有这种能力。下面的正则表达式匹配编号为任何位数的章节标题：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/Chapter [1-9][0-9]*/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;注意，限定符出现在范围表达式之后。因此，它应用于整个范围表达式，在本例中，只指定从 0 到 9 的数字（包括 0 和 9）。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;这里不使用 + 限定符，因为在第二个位置或后面的位置不一定需要有一个数字。也不使用？字符，因为它将章节编号限制到只有两位数。您需要至少匹配 Chapter 和空格字符后面的一个数字。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;如果知道章节编号被限制为只有 99 章，可以使用下面的表达式来至少指定一位但至多两位数字。</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/Chapter [0-9]&#123;1,2&#125;/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;上面的表达式的缺点是，大于 99 的章节编号仍只匹配开头两位数字。另一个缺点是 Chapter 0 也将匹配。只匹配两位数字的更好的表达式如下：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/Chapter [1-9][0-9]?/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;或</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/Chapter [1-9][0-9]&#123;0,1&#125;/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<strong>*、+和?限定符都是贪婪的，因为它们会尽可能多的匹配文字，只有在它们的后面加上一个?就可以实现非贪婪或最小匹配。</strong></p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;例如，可能搜索 HTML 文档，以查找括在 H1 标记内的章节标题。该文本在文档中如下：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">&lt;H1&gt;Chapter 1 - 介绍正则表达式&lt;/H1&gt;</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<strong>贪婪</strong>：下面的表达式匹配从开始小于符号 (&lt;) 到关闭 H1 标记的大于符号 (&gt;) 之间的所有内容。</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/&lt;.*&gt;/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<strong>非贪婪</strong>：如果只需要匹配开始和介绍 H1 标记，下面的非贪婪表达式只匹配 </p><h1>。<p></p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/&lt;.*?&gt;/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;如果只想匹配开始的 H1 标签，表达式则是：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/&lt;\w+?&gt;/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;通过在 <code>*</code>、<code>+</code> 或 <code>?</code> 限定符之后放置 ?，该表达式从”贪心”表达式转换为”非贪心”表达式或者最小匹配。</p>
<h2 id="定位符"><a href="#定位符" class="headerlink" title="定位符"></a>定位符</h2><p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;定位符能够将正则表达式固定到行首或行尾。它们还能够创建这样的正则表达式，这些正则表达式出现在一个单词内、在一个单词的开头或者一个单词的结尾。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;定位符用来描述字符串或单词的边界，<code>^</code> 和 <code>$</code> 分别指字符串的开始与结束，span class=”marked”&gt;\b 描述单词的前或后边界，span class=”marked”&gt;\B 表示非单词边界。 </p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;正则表达式的限定符有：</p>
<table>
<thead>
<tr>
<th>字符</th>
<th>描述</th>
</tr>
</thead>
<tbody>
<tr>
<td>^</td>
<td>匹配输入字符串开始的位置。如果设置了RegExp对象的Multiline属性，^还会与\n或\r之后的位置匹配</td>
</tr>
<tr>
<td>$</td>
<td>匹配输入字符串结尾的位置。如果设置了RegExp对象的Multiline属性，$还回与\n或\r之前的位置匹配</td>
</tr>
<tr>
<td>\b</td>
<td>匹配一个字边界，即字与空格间的位置</td>
</tr>
<tr>
<td>\B</td>
<td>非字边界匹配</td>
</tr>
</tbody>
</table>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<strong>注意</strong>：不能将限定符与定位点一起使用。由于在紧靠换行或者字边界的前面或后面不能有一个以上位置，因此不允许诸如 <code>^*</code> 之类的表达式。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;若要匹配一行文本开始处的文本，请在正则表达式的开始使用 <code>^</code> 字符。不要将 <code>^</code> 的这种用法与中括号表达式内的用法混淆。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;若要匹配一行文本的结束处的文本，请在正则表达式的结束处使用 <code>$</code>字符。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;若要在搜索章节标题时使用定位点，下面的正则表达式匹配一个章节标题，该标题只包含两个尾随数字，并且出现在行首：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/^Chapter [1-9][0-9]&#123;0,1&#125;/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;真正的章节标题不仅出现行的开始处，而且它还是该行中仅有的文本。它即出现在行首又出现在同一行的结尾。下面的表达式能确保指定的匹配只匹配章节而不匹配交叉引用。通过创建只匹配一行文本的开始和结尾的正则表达式，就可做到这一点。</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/^Chapter [1-9][0-9]&#123;0,1&#125;$/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;匹配字边界稍有不同，但向正则表达式添加了很重要的能力。字边界是单词和空格之间的位置。非字边界是任何其他位置。下面的表达式匹配单词 Chapter 的开头三个字符，因为这三个字符出现字边界后面：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/\bCha/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<code>\b</code> 字符的位置是非常重要的。如果它位于要匹配的字符串的开始，它在单词的开始处查找匹配项。如果它位于字符串的结尾，它在单词的结尾处查找匹配项。例如，下面的表达式匹配单词 Chapter 中的字符串 ter，因为它出现在字边界的前面：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/ter\b/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;下面的表达式匹配 Chapter 中的字符串 apt，但不匹配 aptitude 中的字符串 apt：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">/\Bapt/</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;字符串 apt 出现在单词 Chapter 中的非字边界处，但出现在单词 aptitude 中的字边界处。对于 \B 非字边界运算符，位置并不重要，因为匹配不关心究竟是单词的开头还是结尾。</p>
<h2 id="选择"><a href="#选择" class="headerlink" title="选择"></a>选择</h2><p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;用圆括号将所有选择项括起来，相邻的选择项之间用|分隔。但用圆括号会有一个副作用，是相关的匹配会被缓存，此时可用?:放在第一个选项前来消除这种副作用。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;其中 <code>?:</code> 是非捕获元之一，还有两个非捕获元是 <code>?=</code> 和 <code>?!</code>，这两个还有更多的含义，前者为正向预查，在任何开始匹配圆括号内的正则表达式模式的位置来匹配搜索字符串，后者为负向预查，在任何开始不匹配该正则表达式模式的位置来匹配搜索字符串。</p>
<h2 id="反向引用"><a href="#反向引用" class="headerlink" title="反向引用"></a>反向引用</h2><p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;对一个正则表达式模式或部分模式两边添加圆括号将导致相关匹配存储到一个临时缓冲区中，所捕获的每个子匹配都按照在正则表达式模式中从左到右出现的顺序存储。缓冲区编号从 1 开始，最多可存储 99 个捕获的子表达式。每个缓冲区都可以使用 \n 访问，其中 n 为一个标识特定缓冲区的一位或两位十进制数。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;可以使用非捕获元字符 <code>?:</code>、<code>?=</code> 或 <code>?!</code> 来重写捕获，忽略对相关匹配的保存。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;反向引用的最简单的、最有用的应用之一，是提供查找文本中两个相同的相邻单词的匹配项的能力。以下面的句子为例：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">Is is the cost of of gasoline going up up?</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;上面的句子很显然有多个重复的单词。如果能设计一种方法定位该句子，而不必查找每个单词的重复出现，那该有多好。下面的正则表达式使用单个子表达式来实现这一点：</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;查找重复的单词：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div></pre></td><td class="code"><pre><div class="line">var str = <span class="string">"Is is the cost of of gasoline going up up"</span>;</div><div class="line">var patt1 = /\b([a-z]+) \1\b/;</div><div class="line">document.write(str.match(patt1));</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;捕获的表达式，正如 <code>[a-z]+</code> 指定的，包括一个或多个字母。正则表达式的第二部分是对以前捕获的子匹配项的引用，即，单词的第二个匹配项正好由括号表达式匹配。<code>\1</code> 指定第一个子匹配项。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;字边界元字符确保只检测整个单词。否则，诸如 “is issued” 或 “this is” 之类的词组将不能正确地被此表达式识别。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;正则表达式后面的全局标记 <code>g</code> 指定将该表达式应用到输入字符串中能够查找到的尽可能多的匹配。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;表达式的结尾处的不区分大小写 <code>i</code> 标记指定不区分大小写。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;多行标记指定换行符的两边可能出现潜在的匹配。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;反向引用还可以将通用资源指示符 (URI) 分解为其组件。假定您想将下面的 URI 分解为协议（ftp、http 等等）、域地址和页/路径：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">http://www.runoob.com:80/html/html-tutorial.html</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;下面的正则表达式提供该功能：</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;输出所有匹配的数据：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div></pre></td><td class="code"><pre><div class="line">var str = <span class="string">"https://www.runoob.com:80/html/html-tutorial.html"</span>;</div><div class="line">var patt1 = /(\w+):\/\/([^/:]+)(:\d*)?([^<span class="comment"># ]*)/;</span></div><div class="line">arr = str.match(patt1);</div><div class="line"><span class="keyword">for</span> (var i = 0; i &lt; arr.length ; i++) &#123;</div><div class="line">    document.write(arr[i]);</div><div class="line">    document.write(<span class="string">"&lt;br&gt;"</span>);</div><div class="line">&#125;</div></pre></td></tr></table></figure>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;第一个括号子表达式捕获 Web 地址的协议部分。该子表达式匹配在冒号和两个正斜杠前面的任何单词。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;第二个括号子表达式捕获地址的域地址部分。子表达式匹配 / 和 : 之外的一个或多个字符。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;第三个括号子表达式捕获端口号（如果指定了的话）。该子表达式匹配冒号后面的零个或多个数字。只能重复一次该子表达式。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;最后，第四个括号子表达式捕获 Web 地址指定的路径和 / 或页信息。该子表达式能匹配不包括 # 或空格字符的任何字符序列。</p>
<p>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;将正则表达式应用到上面的 URI，各子匹配项包含下面的内容：</p>
<ul>
<li>第一个括号子表达式包含”http”</li>
<li>第二个括号子表达式包含”www.runoob.com”</li>
<li>第三个括号子表达式包含”:80”</li>
<li>第四个括号子表达式包含”/html/html-tutorial.html”</li>
</ul>
</h1>
	

	
		<span class="different-posts"><a href="/2017/10/12/正则表达式/2. 正则表达式-语法/" onclick="window.history.go(-1); return false;">⬅️ Go back </a></span>

	

</article>

	</main>

	<footer class="footer">
	<div class="footer-content">
		
	      <div class="footer__element">
	<p>Hi there, <br />welcome to my Blog glad you found it. Have a look around, will you?</p>
</div>

	    
	      <div class="footer__element">
	<h5>Check out</h5>
	<ul class="footer-links">
		<li class="footer-links__link"><a href="/archives">Archive</a></li>
		
		  <li class="footer-links__link"><a href="/atom.xml">RSS</a></li>
	    
		<li class="footer-links__link"><a href="/about">about page</a></li>
		<li class="footer-links__link"><a href="/tags">Tags</a></li>
		<li class="footer-links__link"><a href="/categories">Categories</a></li>
	</ul>
</div>

	    

		<div class="footer-credit">
			<span>© 2017 失落的乐章 | Powered by <a href="https://hexo.io/">Hexo</a> | Theme <a href="https://github.com/HoverBaum/meilidu-hexo">MeiliDu</a></span>
		</div>

	</div>


</footer>



</body>

</html>
